<template>
    <el-container style="width:1100px">

        <el-card shadow="always" style="margin: 0 20px">
            <div style="font-size:16px;">评价管理</div>
            <el-divider />
            <div class="xugou">
                <div>进90天续购率:<span style="color:deeppink">暂无续购</span></div>
                <div class="pingjia">
                    <div>累计评价:<span style="color:deeppink">暂无评价</span></div>
                    <div>累计续购率:<span style="color:deeppink">暂无续购</span></div>
                </div>
            </div>
        </el-card>

        <el-main>
            <el-card shadow="always" style="height:600px">
                <div style="font-size:16px">商品评价</div>
                <el-tabs v-model="activeName">
                    <el-tab-pane label="全部(0)" name="1"></el-tab-pane>
                    <el-tab-pane label="近90天(0)" name="2"></el-tab-pane>
                    <el-tab-pane label="五星(0)" name="3"></el-tab-pane>
                    <el-tab-pane label="四星(0)" name="4"></el-tab-pane>
                    <el-tab-pane label="三星(0)" name="5"></el-tab-pane>
                    <el-tab-pane label="二星(0)" name="6"></el-tab-pane>
                    <el-tab-pane label="一星(0)" name="7"></el-tab-pane>
                </el-tabs>
                <el-table></el-table>
            </el-card>

        </el-main>

    </el-container>
</template>

<script setup lang="ts">
import { ref } from "vue";

const activeName = ref('1')
</script>

<style scoped>
.el-container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.xugou {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}

.pingjia {
    display: flex;
    justify-content: space-between;
    width: 300px;
}
</style>
